<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JMax UI</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>${SystemName!'JMax'}</title>
<script type="text/javascript">
function importJS(path){
	document.write("<script type='text/javascript' src='"+path+"'/>");
}

function importCSS(path) {
	document.write("<link rel='stylesheet' type='text/css' href='"+path+"'/>");
}

// importCSS('static/plugins/jquery-easyui-1.5/themes/metro/easyui.css');
// importCSS('static/plugins/jquery-easyui-1.5/themes/icon.css');
// importJS('static/plugins/jquery/jquery.min.js');
// importJS('static/plugins/jquery/jquery.form.js');
// importJS('static/plugins/jquery-easyui-1.5/jquery.easyui.min.js');
// importJS('static/plugins/jquery-easyui-1.5/locale/easyui-lang-zh_CN.js');
// importJS('static/jmax/js/common.js');
// importJS('static/plugins/echarts/echarts.common.min.js');
// importJS('static/jmax/js/index.js');
// importCSS('static/jmax/css/jmax.css');
// importJS('static/jmax/js/index-startup.js');
</script>


<link rel="shortcut icon" href="static/jmax/images/favicon.png">
<link rel="stylesheet" type="text/css" href="static/plugins/jquery-easyui-1.5/themes/metro/easyui.css">
<link rel="stylesheet" type="text/css" href="static/plugins/jquery-easyui-1.5/themes/icon.css">
<link rel="stylesheet" type="text/css" href="static/jmax/css/jmax.css">
<!-- <link rel="stylesheet" type="text/css" href="static/plugins/jeasyui-extensions/jeasyui.extensions.css"> -->
<script type="text/javascript" src="static/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript" src="static/plugins/jquery-easyui-1.5/jquery.easyui.min.js"></script>
<script type="text/javascript" src="static/plugins/jquery-easyui-1.5/locale/easyui-lang-zh_CN.js"></script>
<!-- <script type="text/javascript" src="static/plugins/release/jquery.jdirk.min.js"></script> -->
<!-- <script type="text/javascript" src="static/plugins/release/jeasyui.extensions.all.min.js"></script> -->
<script type="text/javascript" src="static/jmax/js/common.js"></script>


<script type="text/javascript">
	$(function() {
		var menus = ${menusJson![]};
		

		function createSubMenuHtml(id)
		{
			var html = '<div id="titlebar1" style="padding: 1px;width:80px;">';
			for(var i=0;i<menus.length ;i++)
			{
				console.log(menus[i]);
// 				html += menus[i].name;
				if(id==menus[i].id) {
					var subMenus = menus[i].children;
					for(var j=0;j<subMenus.length;j++) {
						html += '<a href="javascript:void(0)" class="easyui-linkbutton" style="width: 100%" data-options="iconCls:\'icon-large-picture\',size:\'large\',iconAlign:\'top\'" onclick="addSubMenuTab('+subMenus[j].id+',\''+subMenus[j].name+'\',\''+subMenus[j].url+'\')">'+subMenus[j].name+'</a>';
					}
					break;
				}
			}
			return html+'</div>';
		}
		
		
		$('#systemMenu a').click(function() {
			$('#systemMenu a').removeClass('active');
			$(this).addClass('active');
			var d = $(this).attr('value');
			$('#mainLayout').layout('remove','west');
			$('#mainLayout').layout('add',{
				region : 'west',
				split : false,
				collapsed : true,
				hideExpandTool : true,
				expandMode : null,
				hideCollapsedContent : false,
				collapsedSize : 80,
				collapsedContent : function() {
					
					return createSubMenuHtml(d);
				},
			});
			$.parser.parse('#mainLayout');
		});
	});
	
	function addSubMenuTab(menuId,menuName,menuUrl) {
		console.log(menuId+menuName+menuUrl);
		$('#mainTabs').tabs('add',{
		    title:menuName,
		    href:menuUrl,
		    closable:true,
// 		    tools:[{
// 		        iconCls:'icon-mini-refresh',
// 		        handler:function(){
		        	
// 				}
// 			} ]
		});
	}
</script>
</head>
<body>
	<div id="mainLayout" class="easyui-layout" data-options="fit: true">
		<div data-options="region:'north',border: false">
			<div class="top-bar">
				<div class="top-bar-left">
					<img src="static/jmax/images/zk-logo.png" border="0" align="absmiddle" />
				</div>
				<div class="top-bar-menu">
					<!-- 一级模块菜单 -->
					<#include "systemMenu.html">
				</div>
				<div class="top-bar-right">
					<!-- 				 	<a href="#" id="editpass">修改密码</a>  -->
					<!-- 				 	<a href="#" id="loginOut">安全退出</a> -->
				</div>
			</div>
		</div>
		
<!-- 		<div data-options="region:'east',split:true," title="222" style="width:100px;"></div> -->

<!-- 		<div id="mainWest" data-options="region:'west',split:false,collapsed:true,hideExpandTool: true,expandMode: null,hideCollapsedContent: false,collapsedSize: 80,collapsedContent: function(){return $('#titlebar1');}" style="width:240px;"> -->
<!-- 		</div> -->
		
		<div data-options="region:'center',border: false">
			<div id="mainTabs" class="easyui-tabs"
				data-options="fit:true,border:false,plain:true">
				<div title="首页" data-options="href:''" id="home">
					
				</div>
			</div>
		</div>
<!-- 		<div data-options="region:'south',split:false" -->
<!-- 			style="height: 36px; text-align: center; font-size: 16px; padding-top: 5px;"> -->
<!-- 			2016 © JMax by max. Welcome!</div> -->
	</div>

	
<!-- 	<div id="titlebar1" style="padding: 1px;width:80px;"> -->
<!-- 		<a href="javascript:void(0)" class="easyui-linkbutton" onclick="addSubMenuTab(17,'用户组管理','group.do?group')" -->
<!-- 			style="width: 100%" -->
<!-- 			data-options="iconCls:'icon-large-picture',size:'large',iconAlign:'top'">人员2</a> -->
<!-- 		<a href="javascript:void(0)" class="easyui-linkbutton" -->
<!-- 			style="width: 100%" -->
<!-- 			data-options="iconCls:'icon-large-shapes',size:'large',iconAlign:'top'">部门2</a> -->
<!-- 		<a href="javascript:void(0)" class="easyui-linkbutton" -->
<!-- 			style="width: 100%" -->
<!-- 			data-options="iconCls:'icon-large-smartart',size:'large',iconAlign:'top'">卡2</a> -->
<!-- 		<a href="javascript:void(0)" class="easyui-linkbutton" -->
<!-- 			style="width: 100%" -->
<!-- 			data-options="iconCls:'icon-large-chart',size:'large',iconAlign:'top'">参数设置2</a> -->
<!-- 	</div> -->
</body>
</html>
